<template>
  <div class="aa">
    <div><img :src="movieObj.img" /></div>
    <div class="bb">
      <div class="yingming">{{ movieObj.nm }}</div>
      <div class="zhuyan">{{ movieObj.star }}</div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "MovieItem",
  data() {
    return {
      id: "",
      movieObj: {}, //内容页的数据是对象
    };
  },
  mounted() {
    //获取从首页传过来的参数
    console.log(this.$route.params);
    this.id = this.$route.params.id;
    axios.get("./json/" + this.id + ".json").then((res) => {
      console.log(res);
      this.movieObj = res.data.data.movie;
      this.movieObj.img = this.movieObj.img.replace("w.h", "100.138");
    });
  },
};
</script>
<style lang="less" scoped>
.cc {
  width: 100%;
  background: #19402c;
}
.aa {
  display: flex;
  justify-content: space-around;
  //
  //
  background: #19402c;
  img {
    width: 100%;
    margin-left: 20px;
    margin-top: 20px;
  }
  .bb {
    width: 50%;
    margin-left: 20px;
    margin-top: 20px;
    font-size: 13px;
    .yingming {
      color: #fff;
    }
    .zhuyan {
      color: #a3b3ab;
    }
  }
}
</style>